<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,user-scalable=no,
    initial-scale=1.0,maximum-scale=1.0, minimum-scale=1.0">
    <title>便捷停车</title>
    <!-- 固定复制 -->
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/通用.css">
    <script src="js/animate.js"></script>
    <script src="js/通用.js"></script>
    <!-- 该界面的css文件 -->
    <link rel="stylesheet" href="css/便捷停车.css">
</head>

<body>
    <!-- 上导航 -->
    <div class="heard_top  center_V">
        <!-- 左菜单栏 menubar -->
        <a href="javaScript:;" class="menubar center_VH"></a>
        <!-- 中间标题 centerT -->
        <a class="centerT center_VH" href="../index.html">
            <span class="logo">
            </span>
            <h3 class="name">智能停车</h3>
        </a>
        <!-- 用户中心 -->
        <div class="user">
            <a href="../用户登录.html"></a>
        </div>
    </div>
    <!-- 侧边栏 -->
    <div class="nav_intheleft">
        <div class="nav_left">
            <div class="nav_left_in">
                <ul class="nav_list">
                    <a href="../index.html" class="center_V">
                        <span class="sy"></span>
                        <p>首页</p>
                    </a>
                    <a href="../预停指南.html" class="center_V adv2">
                        <span></span>
                        <p>预停指南</p>
                    </a>
                    <a href="../预停车位.html" class="center_V video">
                        <span></span>
                        <p>预停车位</p>
                    </a>
                    <a href="../客服服务.html" class="center_V">
                        <span></span>
                        <p>客服服务</p>
                    </a>
                </ul>
            </div>
        </div>
    </div>
    <!-- 身体部分 -->
    <div class="body_part">
        <!-- 快速导航部分 -->
        <div class="quick_navigation">
            <div class="box_top_two center_V">
                <div class="litter_box"></div>
                <span class="box_name">快捷导航</span>
            </div>
            <div class="mask_map">

            </div>
        </div>
        <!-- 历史车位部分 -->
        <div class="history">
            <div class="box_top">
                <span class="box_top_name">
                            — 历史车位 —
                        </span>
                <a class="box_top_more" href="Javascript:;">></a>
            </div>
            <div class="nearby_body">
                <div class="swiper mySwiper">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <a class="nearby_body_imgbox" href="Javascript:;">
                                <div class="nearby_body_img1"></div>
                                <span class="nearby_body_imgspan">黑马超市</span>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a class="nearby_body_imgbox" href="Javascript:;">
                                <div id='nearby_body_img2' class="nearby_body_img2"></div>
                                <span class="nearby_body_imgspan">森林公园停车场</span>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a class="nearby_body_imgbox" href="Javascript:;">
                                <div id='nearby_body_img3' class="nearby_body_img"></div>
                                <span class="nearby_body_imgspan">菜鸟停车场</span>
                            </a>
                        </div>
                    </div>
                    <div class="swiper-pagination"></div>
                </div>

                <!-- Swiper JS -->
                <script src="js/swiper-bundle.min.js"></script>

                <!-- Initialize Swiper -->
                <script>
                    var swiper = new Swiper(".mySwiper", {
                        slidesPerView: 3,
                        spaceBetween: 0,
                        pagination: {
                            el: ".swiper-pagination",
                            clickable: true,
                        },
                    });
                </script>
            </div>
        </div>
        <!-- 附近停车 -->
        <div class="near_parking">
            <div class="box_top">
                <span class="box_top_name">
                            — 附近车位 —
                        </span>
                <a class="box_top_more" href="Javascript:;">></a>
            </div>
            <div class="hot_news_body">
                <div class="hot_news_list">
                    <!-- Swiper -->
                    <div class="swiper-container">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide">
                                <div class="neary_img1" id="neary_img1"></div>
                                <div class="news_word">
                                    <h5>黑马超市停车场</h5>
                                </div>
                            </div>
                            <div class="swiper-slide">
                                <div class="neary_img2" id="neary_img2"></div>
                                <div class="news_word">
                                    <h5>菜鸟停车场</h5>
                                </div>
                            </div>
                            <div class="swiper-slide">
                                <div class="neary_img3" id="neary_img3"></div>
                                <div class="news_word">
                                    <h5>森林公园停车场</h5>
                                </div>
                            </div>
                            <div class="swiper-slide">
                                <div class="neary_img4" id="neary_img4"></div>
                                <div class="news_word">
                                    <h5>永辉超市停车场</h5>
                                </div>
                            </div>
                        </div>
                        <div class="swiper-scrollbar "></div>
                    </div>

                    <!-- Swiper JS -->
                    <script src="js/swiper-bundle.min.js "></script>

                    <!-- Initialize Swiper -->
                    <script>
                        refreshEnd = false;
                        times = 0; //加载次数
                        oriSpeed = 300
                        var swiper = new Swiper('.swiper-container', {
                            speed: oriSpeed,
                            slidesPerView: 'auto',
                            freeMode: true,
                            direction: 'vertical',
                            setWrapperSize: true,
                            scrollbar: {
                                el: '.swiper-scrollbar',
                            },
                        });
                    </script>
                </div>
            </div>
            <div class="near_parking_footer center_H">
                <button class="pro"></button>
                <div class="num">
                    <span class="now">1</span>
                    <i>/</i>
                    <span class="sum">1</span>
                </div>
                <button class="nex"></button>
            </div>
        </div>
    </div>
    <!-- footer -->
    <div class="footer ">
        <span>©2021 版权所有</span>
        <br>
        <i class="footer_one ">移动端</i>

        <i>
            仅用于学习交流使用 <br> 版权归
            <a href="https://jzm.fkw.com/?_ta=2508 ">“点我”</a>
            所有
        </i>
        <i>严禁抄袭</i>
    </div>
    <!-- 底部导航 -->
    <div class="footer_nav ">
        <div class="footer_nav_list ">
            <a href="../index.html" class="footer_nav_btn1 center_VH ">
                <i id="btn1_font "></i>
                <span>首页</span>
            </a>
            <a href="预停指南.html " class="footer_nav_btn2 center_VH ">
                <i id="btn2_font "></i>
                <span>预停指南</span>
            </a>
            <a href="客服服务.html " class="footer_nav_btn3 center_VH ">
                <i id="btn3_font "></i>
                <span>客服服务</span>
            </a>
        </div>
    </div>
</body>

</html>